{% extends 'saltstack/index.html' %}
{% block right_content %}
<div id="right_menu">
    <form class="form-inline" method="POST" id="reasonform"  role="search" onsubmit="return false">
        <pre>请选择需要执行命令的主机</pre>
        <div class="voilet_test">
            <label for="minions">主机名:</label>
            <select type="text" id="minions" class="form-control" style="">
                {% for i in salt_key %}
                    <option value="{{ i.id }}">{{ i.minions }}</option>
                {% endfor %}
            </select>
        </div>

        <div class="alert alert-dismissable ">
        </div>

        <div class="row">
          <div class="col-lg-6">
            <div class="input-group">
              <input type="text" class="form-control" name="salt_node_name" id="salt_node_name" placeholder="输入主机名" onkeyup="searchNodeList()" style="height: 40px;" />
              <span class="input-group-addon">命令类型
                  <select id="id_brand" class="form-control" name="comm_shell" style="height: 26px;">
                      <option value="cmd" selected="selected">cmd.run</option>
                      <option value="grains">grains.item</option>
                  </select>
              </span>
            </div>
          </div>
          <div class="col-lg-6">
            <div class="input-group">
             <span class="input-group-btn">
                <button class="btn btn-default disabled" type="button">命令</button>
              </span>
             <input type="text" class="form-control" name="salt_cmd" id="salt_cmd" placeholder="如:ifconfig  命令可连输，如ls;pwd;uname -a中间以;做分割" maxlength="200" size="200"/>
              <span class="input-group-btn">
                <button class="btn btn-success" id="button" type="button">执行</button>
              </span>
            </div>
          </div>
        </div>
    </form>
    <div id="salt_cmd_run"></div>
</div>

<script type="text/javascript">
$('#minions').change(function(){
    var minion = $("#minions  option:selected").text();
    $("#salt_node_name").val(minion);
});

$(document).ready(function(){
$("#salt_node_name").val($("#minions  option:selected").text());

$('#button').click(function(){
    var salt_node_name = $("#salt_node_name").val();
    var salt_cmd = $("#salt_cmd").val();
    if(salt_node_name == ''){
        $("#salt_cmd_run").html("<font size='2' style='color:red'>请出入主机名</font>");
        return;
    }
    if(salt_cmd == ''){
        $("#salt_cmd_run").html("<font size='2' style='color:red'>请输入命令</font>");
        return;
    }
    var urls = "{% url 'saltstack:nodeExists' %}"
    var postdata = {salt_node_name:salt_node_name}
    var jsonstr = $.ajax({
			    url : urls,
			    type : "POST",
			    data : postdata,
			    async : false,
			    cache : false
			});
	var jsonobj = eval('(' + jsonstr.responseText + ')');
	if(!jsonobj.status){
	    $("#salt_cmd_run").html("<font size='2' style='color:red'>主机不存在</font>");
	    return;
	}
    var comm_shell = $("#id_brand").val();
    var postdata = {salt_node_name:salt_node_name,comm_shell:comm_shell,salt_cmd:salt_cmd}
    jQuery.ajax({
      url: "{% url 'saltstack:cmd' %}",                  // 提交的页面
      data: postdata, // 从表单中获取数据
      type: "POST",                       // 设置请求类型为"POST"，默认为"GET"
      beforeSend: function(){             // 设置表单提交前方法
        //alert('表单提交前');
      },
      error: function(request){           // 设置表单提交出错
        alert("表单提交出错，请稍候再试");
      },
      dataType:'text',
      success: function(msg){
          $("#salt_cmd_run").html(msg)
      }
    });
    return false;
  });
});

//根据人员查询业务分类和主机

$(function(){
  $(".btn-ajax").click(function(){
         var url = $(this).attr("href");
         $.get(url,function(data){
             $("#node_name").html(data);
         })
     });
 });


$("body").bind('keyup',function(event) {
    if(event.keyCode==13){
    document.form.submit();
    }
});

var nodeLists = [];
function searchNodeList(){
    var salt_node_name = $("#salt_node_name").val();
    if(salt_node_name != ''){
        var urls = "{% url 'saltstack:searchNodes' %}";
        var postdata = {search:salt_node_name}
        var jsonstr = $.ajax({
			url : urls,
			type : "POST",
			data : postdata,
			async : false,
		    cache : false
		});
	    var jsonobj = eval('(' + jsonstr.responseText + ')');
	    if(jsonobj.data){
	        nodeLists = [];
                for(var i in jsonobj.data){
                    nodeLists.push(jsonobj.data[i]);
                }
	    }
    }
}

$("#salt_node_name").autocomplete({
        source: function( request, response ) {
            response( $.grep( nodeLists, function( item ){
                return nodeLists;
            }) );
        }
    });

</script>





{% endblock right_content %}
